var nbselect = 0;
(function($) {
	$.fn.scrollablecombo = function(options) {
		return this.each(function() {
			$this = $(this);
			
			function findHighestZIndex(){
				var divs = document.getElementsByTagName('div');
				var highest = 0;
				for (var i = 0; i < divs .length; i++)
				{
					var zindex = divs[i].style.zIndex;
					if (zindex > highest) {
						highest = zindex;
					}
				}
				return highest;
			}

			/** 
			* hide the select element
			* graceful degradation
			*/
			$this.hide();
			
			function makeScrollable($wrapper, $container){
				var extra 			= 50;
				var wrapperHeight 	= $wrapper.height() ;
				$wrapper.css({overflow: 'hidden'});
				$wrapper.scrollTop(0);
				$wrapper.unbind('mousemove').bind('mousemove',function(e){
					var ulHeight 	= $container.outerHeight() + 2*extra ;
					var top 		= (e.pageY - $wrapper.offset().top) * (ulHeight-wrapperHeight ) / wrapperHeight - extra;
					$wrapper.scrollTop(top);
				});
			}
			
			/**
			* let's build our element structure
			*/
			var $ul_e 	= $('<ul />');
			
			$this.find('option').each(function(){
				var $option = $(this);
				var liclass = '';
				if($option.attr('selected'))
					liclass = 'selected';
				var $li_e 	= $('<li />',{
					className	:	liclass,
					html		:	'<a onclick="createComboBox(\''+$option.html()+':'+getSelectClass(nbselect)+'\')">'+$option.html()+'</a>'
				});
				$ul_e.append($li_e);
			});
			
			var $wrapper_e 	= $('<div />',{
				className	:	'cb_selectWrapper'
			});
			
			$wrapper_e.append($ul_e);
			
			var $control_e 	= $('<div />',{
				id			:	getSelectClass(nbselect),
				className	:	'cb_selectMain cb_down',
			});
			
			var $select_e 	= $('<div />',{
				className	:	'cb_select' + getSelectClass(nbselect)
			});
			
			$select_e.append($wrapper_e).append($control_e);
			
			var $selected	= $ul_e.find('.selected');
			
			
			function openCombo(){
				var maxzidx = Math.max(findHighestZIndex(),99999);
				$wrapper_e.css('z-index',parseInt(maxzidx+1000)).show();
				$control_e.addClass('cb_up').removeClass('cb_down');
				makeScrollable($wrapper_e,$ul_e);
			}
			function closeCombo(){
				$wrapper_e.css('z-index',1000).hide();
				$control_e.addClass('cb_down').removeClass('cb_up');
			}
			$control_e.html($selected.find('a').html())
					  .bind('click',function(){
						  (!$wrapper_e.is(':visible'))? openCombo() : closeCombo();
					  }
			);
			$selected.hide();
			
			$this.parent().append($select_e);
			$this.remove();
			
			
			$ul_e.find('a').bind('click',function(e){
				var $this 		= $(this);
				$control_e.html($this.html());
				$control_e.val($this.html());
				var $selected	= $ul_e.find('.selected');
				$selected.show().removeClass('selected');
				$this.parent().addClass('selected').hide();
				closeCombo();
				e.preventDefault();
			});
			
			$select_e.hover(function(e){},function(e){
				closeCombo();
				e.preventDefault();
			});
			nbselect++;
		});
	};
	$.fn.scrollablecombo.defaults = {
		
	};
})(jQuery);

function getSelectClass(id){
	switch(id) {
		case 0 : return ' environnement';
		break;
		case 1 : return ' agence';
		break;
		case 2 : return ' site';
		break;
		case 3 : return ' flux';
		break;
		case 4 : return ' officeid';
		break;
		default: return '';
	}
}

function createComboBox(cle) {
	var tableElement = cle.split(':');
	switch(tableElement[1]) {
		case  ' environnement' : createAgenceComboBox(tableElement[0]);
		break;
		case ' agence' : createSiteComboBox($('.environnement li.selected a').html(), tableElement[0]);
		break;
		case ' site' : createFluxComboBox($('.environnement li.selected a').html(), $('.agence li.selected a').html(), tableElement[0]);
		break;
		case ' flux' : createOfficeIdComboBox($('.environnement li.selected a').html(), $('.agence li.selected a').html(), $('.site li.selected a').html(), tableElement[0]);
		break;
		default: return;
	}
	$('.box #ui_element').scrollablecombo();
}

function createEnvironnementComboBox(){
	var environnements = dictionnaire.prototype.getEnvironnement();
	var environnementhtml = '<select id="ui_element"><option value="" selected="selected">'+siteString('environnement')+'</option>';
	for(var i = 0; i < environnements.length; i++){
		environnementhtml += '<option value="'+environnements[i]+'">'+environnements[i]+'</option>';
	}
	environnementhtml += '</select>';
	replaceElement('div.environnement', environnementhtml);
	nbselect = 0;
}

function createAgenceComboBox(environnement){
	var agences = dictionnaire.prototype.getAgence(environnement);
	var agencehtml = '<select id="ui_element"><option value="" selected="selected">'+siteString('agence')+'</option>';
	for(var i = 0; i < agences.length; i++){
		agencehtml += '<option value="'+agences[i]+'">'+agences[i]+'</option>';
	}
	agencehtml += '</select>';
	replaceElement('div.agence', agencehtml);
	nbselect = 1;
}

function createSiteComboBox(environnement, agence){
	var sites = dictionnaire.prototype.getSite(environnement, agence);
	var sitehtml = '<select id="ui_element"><option value="" selected="selected">'+siteString('site')+'</option>';
	for(var i = 0; i < sites.length; i++){
		sitehtml += '<option value="'+sites[i]+'">'+sites[i]+'</option>';
	}
	sitehtml += '</select>';
	replaceElement('div.site', sitehtml);
	nbselect = 2;
}

function createFluxComboBox(environnement, agence, site){
	if(site == 'fo'){
		var flux = dictionnaire.prototype.getFlux(environnement, agence, site);
		var fluxhtml = '<select id="ui_element"><option value="" selected="selected">'+siteString('flux')+'</option>';
		for(var i = 0; i < flux.length; i++){
			fluxhtml += '<option value="'+flux[i]+'">'+flux[i]+'</option>';
		}
		fluxhtml += '</select>';
		replaceElement('div.flux', fluxhtml);
		nbselect = 3;
	} else {
		replaceElement('div.flux', '');
		replaceElement('div.officeid', '');
	}
}

function createOfficeIdComboBox(environnement, agence, site, flux){
	var officeid = dictionnaire.prototype.getOfficeId(environnement, agence, site, flux);
	var officeidhtml = '<select id="ui_element"><option value="" selected="selected">'+siteString('officeid')+'</option>';
	for(var i = 0; i < officeid.length; i++){
		officeidhtml += '<option value="'+officeid[i]+'">'+officeid[i]+'</option>';
	}
	officeidhtml += '</select>';
	replaceElement('div.officeid', officeidhtml);
	nbselect = 4;
}

function replaceElement(element, elementhtml){
	if($.find(element).length == 1)
		$(element).replaceWith(elementhtml);
	else
		$('.box').append(elementhtml);
	// initialisation de les elements i+1
	initComboBox(element);
}

function initComboBox(element){
	switch(element) {
	case 'div.agence' : 
		replaceElement('div.site', ''); 
		replaceElement('div.flux', '');
		replaceElement('div.officeid', '');
	break;
	case 'div.site' : 
		replaceElement('div.flux', '');
		replaceElement('div.officeid', '');
	break;
	default: return;
}
}

function openUrl() {
	var url = dictionnaire.prototype.getUrl($('.environnement li.selected a').html(), $('.agence li.selected a').html(), $('.site li.selected a').html(), $('.flux li.selected a').html(), $('.officeid li.selected a').html());
  	if(url.length == 1)  
  		window.open(url, '_blank');
  	return false;
}